Carousel Gallery: Showcasing the CSS Carousel Specs — These are completely JavaScript-free examples that use properties like overscroll-behavior, scroll-snap-type, anchor-name, and so forth. You can also check out this configurator that helps you build one and visualize how the code works. Note, these features are currently available in Chrome 135+ and other Chromium-based browsers.

Adam Argyle

🎂 Celebrating 20 Years of MDN — After two decades the MDN resource is now home to over 14,000 pages of documentation covering some 18,000 features. It’s a comprehensive and valuable resource for us all — long may it continue. (Oh, and Google sent a cake.)

Joe Walker

Avoid Common Mistakes in React and Next.js — Avoid redundant useState and useEffect, deeply nested data, unscalable forms, and hidden shared state bugs. David Khourshid teaches practical patterns to refactor complex apps and scale with confidence!

Frontend Masters sponsor

Brick by Brick: Help Us Build CSS Masonry — Yes, issues surrounding the CSS masonry specification and syntax still remain, but you can now test things in Chrome and Edge 140 (behind a flag). This post dives deep into how it can be used, and asks for our feedback.

Brosset & Maher

Making a Masonry Layout That Works Today — In relation to the above — there’s been plenty of back and forth on the new syntax to make creating masonry style layouts easier to create with CSS. But we’re not yet at a point where a final, universal decision has been made — as such, Zell shares what we can actually do right now, no flags required (thanks to a touch as JS).

Zell Liew

Making Sense of the Performance Extensibility API — The Performance Extensibility API allows us to create custom tracks in Chrome DevTools’ Performance panel — here’s how to make use of it.

Harry Roberts

What is Multi-Tenancy and Why It Matters For B2B SaaS — Most B2B apps need multi-tenancy—few get it right. Here’s why it matters and how to design for it.

Clerk sponsor

Creating a 'Scroll-Spy' with 2 Lines of CSS — There’s a new CSS feature landing in Chrome 140 that lets you easily create a trackable table of contents. This effect can be achieved with a new CSS property called scroll-target-group combined with the :target-current pseudo class.

Una Kravets

When is WebAssembly Going to Get DOM Support? — Working with the DOM from JavaScript is straightforward, but WebAssembly requires (a lot of) glue code to do it. Is this going to change? Daniel of the TC39 committee digs into the issue here and says that modern build toolchains and WASM’s evolution are making things easier all the time.

Daniel Ehrenberg

Liquid Glass on the Web — Apple’s various operating systems will get a new, universal design aesthetic this fall, but before that roll out here’s how some developers are attempting to bring this new look to the web now.

Chris Coyier

Web Components: Working With Shadow DOM — A look at how Shadow DOM fits into the broader Web Components picture, explaining why it matters, when to use it, and how to apply it effectively.

Russell Beswick

World Clock Slider — This is a really smart clock component in which you can check the time in various global cities — just move the slider to see it in action. A super smooth demo, and it has a nice dark mode too.

Jon Kantner codepen

StaticSearch: Add Search Functionality to Any Static Site — This solution relies on JavaScript along with data stored as JSON, so there’s no server tech needed. Usable with any static site tool but originally designed for Publican. Full docs are here.

Craig Buckler

The Road to Next — Expand your frontend skills into the backend with a modern full-stack tech stack: Next.js 15 and React 19.

Robin Wieruch sponsor

Introducing Quickstrom: High-Confidence Browser Testing — A new autonomous testing tool for the web. It claims it can find problems in “any type of web application that renders to the DOM”.

Oskar Wickström

Oklchroma: A Color Pattern Generator to Create Harmonious Color Scales in the OKLCH Color Space — Provide a base color and the tool will generate a full palette, with copy/paste CSS, using a trigonometric function to, as the author explains, “adjust the Chroma as a sort of an easing wave”.

Brecht De Ruyte

FossFLOW: Make Beautiful Isometric Infrastructure Diagrams — You can use the tool here. One of the neat features is the ability to insert a node then update the icon’s appearance from a variety of tech categories. There also options to save, load, import diagrams, etc.

stan smith

difit: A CLI Tool to View Local Git Diffs with a GitHub-Style Viewer — You can view in the terminal or use the web UI. Also allows you to add comments to diffs and copy them with file paths and line numbers for use with AI tools.

yoshiko

7.css: A Design System for Building Faithful Recreations of Classic UIs — The style is similar to Windows 7 – hence the name – and built on top of XP.css which takes a Windows XP style approach. We’ve shared before, but it’s just been updated.

Khang Nguyen Duy